<template>
	<view class="pageBox">
		<!-- 标题栏 -->
		<head-navbar :back="true">
			<view>收货地址</view>
		</head-navbar>
		<view class="content">
			<view class="list">
				<view class="item" style="display: flex;align-items: center;justify-content: flex-end;">
					<view class="title" style="margin-right: 30upx;">
						<text class="right">默认地址</text>
					</view>
					<u-switch v-model="param.defaultAddress" active-color="#FE5900" size="40"></u-switch>
				</view>
				<view class="item">
					<view class="title">
						<text class="right">姓名</text>
					</view>
					<view class="inp">
					<input type="text" placeholder="请输入收货人姓名"  v-model="param.consigneeName"/>
					</view>
				</view>
				<view class="item">
					<view class="title">
						<text class="right">手机号</text>
					</view>
					<view class="inp">
					<input type="number" v-model="param.consigneePhone" placeholder="请输入收货人手机号"  maxlength="11"/>
					</view>
				</view>
				<view class="item" style="position: relative;border-bottom: 1px solid #EBEBEB;">
					<pickerAddress @change="change">
						<view class="title" style="margin-bottom: 10rpx;">
							<text class="right">所在地区</text>
						</view>
						<view class="inp" style="padding: 20rpx 6rpx; padding-bottom: 20rpx;">
						<input type="text" :value="param.region" :disabled="true"  />
						</view>
						<view class="iconfont icon-fanhui left"></view>
					</pickerAddress>
				</view>
				<view class="item">
					<view class="title">
						<text class="right">所在地区</text>
					</view>
					<view class="inp">
					<input type="text" v-model="param.detailAddress" placeholder="如道路、门牌号、小区、楼栋号、单元室等"  />
					</view>
				</view>
			</view>

			<button type="default" class="summitBtn" @click="addBtn">确定</button>
		</view>
	</view>
</template>

<script>
	import * as api from '@/api/user/address.js';
	import pickerAddress from '@/components/wangding-pickerAddress/wangding-pickerAddress.vue';
	import searchCode from '@/utils/areaCode.js';
	export default {
		componentName: 'pickerAddress',
		
		components: {
			pickerAddress
		},
		data() {
			return {
				type:'add',
				param: {
					consigneeName: '',		//收货人
					consigneePhone: '',		//电话
					detailAddress: '',			//详细地址
					provincial:'510000',		//省
					city:'528000',				//市
					area:'528000',				//区		
					region:'选择地址',				//区域
					defaultAddress:false	//默认地址
				}
			}
		},
		onLoad(option){
			this.type = option.type;
		},
		onReady() {
			if(this.type != 'add') {
				try {
				    const data = uni.getStorageSync('addressDetail');
					data.defaultAddress == 1 ? data.defaultAddress = true : data.defaultAddress = false;
					this.param = {
						id:data.id,
						consigneeName:data.consigneeName,
						consigneePhone:data.consigneePhone,
						detailAddress:data.detailAddress,
						region:data.region,
						provincial:data.provincial,
						area:data.area,
						city:data.city,
						defaultAddress:data.defaultAddress
					};
				} catch (e) {
				    this.utils.toast(error.data.msg);
					// error
				}
			}
		},
		methods: {
			// 新增地址
			async addRess() {
				try{
					let param = this.param;
						this.param.defaultAddress ? param.defaultAddress = 1 : param.defaultAddress = 0;
					const ret = await api.insetUserAddress(param);
					uni.navigateBack(2)
				}catch(error){
					this.utils.toast(error.data.msg);
				}
			},
			// 修改地址
			async fixadRess() {
				try{
					let param = this.param;
						this.param.defaultAddress ? param.defaultAddress = 1 : param.defaultAddress = 0;
					const ret = await api.updateUserAddress(param);
					uni.navigateBack(2)
				}catch(error){
					this.utils.toast(error.data.msg);
				}
			},
			change(data) {
				console.log(data.data[0])
				console.log(data.data[1])
				console.log(data.data[1])
				var obj =  searchCode(data.data[0],data.data[1],data.data[2]);
				this.param.provincial = obj._pro;
				this.param.city = obj._city;
				this.param.area = obj._area;
				this.param.region = data.data.join(' ')
			},
			addBtn() {
				if(this.param.region == '选择地址') {
					uni.showToast({title:'请选择地址',icon:'none'})
				}else{
					if(this.type == 'add') {
						this.addRess();
					}else{
						this.fixadRess();
					}
				}
			}
		}
	}
</script>

<style lang="scss">
	@import './index.scss';
</style>
